<!DOCTYPE html>
<html>
{include file='public/header'}
<style>
    .layui-input-block{
        margin-left: 100px;
    }
</style>
<body>
    <div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="javascript:void(0)">首页</a>
            <a href="javascript:void(0)">财务中心</a>
            <a><cite>分销商待处理结算列表</cite></a>
        </span>
        <a class="layui-btn layui-btn-small" id="reload" title="刷新">
            <i class="layui-icon" style="line-height:30px"><i class="iconfont">&#xe6aa;</i></i>
        </a>
    </div>
    <div class="x-body">
        <form class="layui-form" lay-filter="searchForm">
            <div class="layui-inline">
                <label class="layui-form-label w-auto">公司：</label>
                <div id="companyMenu"></div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label w-auto">分销商：</label>
                <div id="pMenu"></div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label w-auto">结算状态：</label>
                <div class="layui-input-block">
                    <select name="status">
                        <option value="">请选择</option>
                        <option value="1">待结算</option>
                        <option value="2">结算中</option>
                        <option value="3">已结算</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label w-auto">结算日期：</label>
                <div class="layui-inline" id="time" style="display: flex;align-items: center;">
                    <div class="layui-input-inline" style="margin-right:10px">
                        <input type="text" class="layui-input" name="start_date" id="start_date" autocomplete="off" placeholder="开始时间">
                    </div>
                    <div class="layui-form-mid">-</div>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" name="end_date" id="end_date" autocomplete="off" placeholder="结束日期">
                    </div>
                </div>
            </div>
            <div class="layui-inline">
                <button class="layui-btn" style="margin-left: 10px;" lay-submit lay-filter="searchList">搜索</button>
                <button type="reset" id="resetList" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </form>
        <table id="distributionSettlementList"  lay-filter="distributionSettlementList"></table>
    </div>
    
    <script type="text/html" id="tbBar">
        {{#  if(d.status == 1 ){ }}
        <a class="layui-btn layui-btn-xs layui-btn-disabled">待申请结算</a>
        {{#  } else if(d.status == 2) { }}
            <a class="layui-btn layui-btn-xs" lay-event="settlement">处理结算</a>
        {{#  } else { }}
            <a class="layui-btn layui-btn-xs layui-btn-disabled">已结算</a>
        {{#  } }}
    </script>
    
    <script>
        let totalObj = {}
        let params = {
            elem: '#distributionSettlementList'
            , toolbar: true
            , url: '/admin/finance/distributionSettlementList' //数据接口
            , id: 'distributionSettlementList'
            , limit:15
            , page:true
            , cols: [[ //表头
                { field: 'id', title: 'ID', align: 'center', width:60}
                , { field: 'company_name', title: '公司名称', width:160, align:'center' }
                , { field: 'name', title: '分销商名称', width:180, align:'center' }
                , { title: '结算日期', align:'center' , width:200, templet:function(d){
                    return `${d.start_date}至${d.end_date}`
                }}
                , { field: 'settlement_price', title: '结算金额', width:112, align:'center' }
                , { field: 'status', title: '结算状态', align:'center', width:90 ,templet:function(d){
                    let status = ''
                    switch (d.status) {
                        case 1:
                            status = '待结算'
                            break;
                        case 2:
                            status = '结算中'
                            break;
                        case 3:
                            status = '已结算'
                            break;
                    }
                    return status
                }}
                , { field: 'tax_rate', title: '增值税率', width:90 , align:'center' }
                , { field: 'payment_method', title: '收款方式', width:100 ,align:'center',templet:function(d){
                    return d.payment_method === 1 ? '银行卡对公' : '银行卡对私'
                } }
                , { field: 'payee', title: '收款人', width:100, align:'center' }
                , { field: 'collection_account', title: '收款账号', width:200, align:'center' }
                , { field: 'bank_name', title: '开户行', align:'center' }
                , { field: 'payment_time', title: '打款时间', width:170 ,align:'center' , templet: function (d) {
                        return dayjsFormat(d.payment_time)
                    }
                }
                , { align: 'center', toolbar: '#tbBar', title: '操作',width:120 }
            ]],
        }
        tableList(params) 
        layui.use(['table','laydate'], function () {
            var table = layui.table;
            table.on('tool(distributionSettlementList)', function (obj) {
                var event = obj.event;
                if (event === 'settlement') {
                    AnyAjax('确定要结算此订单吗？','/admin/finance/handleDistributionSettlement',{ id: obj.data.id },'distributionSettlementList')
                }
            });

            var laydate = layui.laydate
            // 日期
            laydate.render({
                elem: '#time',
                range: ['#start_date', '#end_date'],
                format: 'yyyy-MM-dd'
            });
        });

        let selectParams = {
            url: '/admin/distribution/selectList',
            elem: '#pMenu',
            selected: [],
            tips: '选择分销商',
            name: 'distributor_id',
            field_id: 'id',
            field_Name: 'name',
        }
        selectN(selectParams)

        let selectCompanyParams = {
            url: '/admin/company/select',
            elem: '#companyMenu',
            selected: [],
            tips: '选择公司',
            name: 'company_id',
            field_id: 'id',
            field_Name: 'name',
        }
        selectN(selectCompanyParams)
    </script>
</body>

</html>